/**
 * @modal: 新增拆分策略
 */
import CommonInput from "@/pages/OrderModule/common/components/CommonInput";
import { CommonModal } from "@/views/components/CommonModal";
import SubTitle from "@/pages/OrderModule/common/components/SubTitle";
import Typography from "@/pages/OrderModule/common/components/Typography";
import { Col, Form, Radio, Row, Select } from "antd";
import Style from "./index.module.less";

function AddSplittingStrategy({ onCancel }) {
	function handleOk() {}
	function handleCancle() {}
	function onFinish() {}
	function onFinishFailed() {}

	return (
		<CommonModal
			title={{ title: "智能拆分策略" }}
			open={true}
			width="552px"
			onCancel={handleCancle}
			onOk={handleOk}
			onCancel={onCancel}
		>
			<Form
				name="basic"
				initialValues={{}}
				onFinish={onFinish}
				onFinishFailed={onFinishFailed}
				autoComplete="off"
				layout="horizontal"
				labelAlign="right"
			>
				<Form.Item name="1">
					<CommonInput placeholder="必填，请输入策略名称" aria-required />
				</Form.Item>
				<Form.Item name="2">
					<CommonInput placeholder="必填，优先级" aria-required />
				</Form.Item>
				<SubTitle className={Style.title} title="策略类型" as="s2" symbol />
				<Radio.Group className={Style.radio_group}>
					<Form.Item name="3">
						<Row align="middle">
							<Col span={6}>
								<Radio value={1}>按数量拆分</Radio>
							</Col>
							<Col span={18}>
								<CommonInput placeholder="订单商品数量" />
							</Col>
						</Row>
					</Form.Item>
					<Form.Item name="4">
						<Row align="middle">
							<Col span={24}>
								<Radio value={2}>按退款状态拆分</Radio>
								<Typography as="s1" color="rgba(153, 153, 153, 1)">
									（拆分成一个包含退款中的商品和一个不包含退款中的商品）
								</Typography>
							</Col>
						</Row>
					</Form.Item>
					<Form.Item name="5">
						<Row align="middle" gutter={[10, 10]}>
							<Col span={24}>
								<Radio value={3}>按供应商/供应商拆单</Radio>
								<Typography as="s1" color="rgba(153, 153, 153, 1)">
									（相同的供应商商品，会拆在同一个订单里，组合商品除外）
								</Typography>
							</Col>
							<Col span={24}>
								<Select className={Style.item_padding} placeholder="请选择供应商" />
							</Col>
							<Col span={24}>
								<Typography className={Style.item_padding} as="s1" color="rgba(153, 153, 153, 1)">
									（相同的供应商商品，会拆在同一个订单里，组合商品除外）
								</Typography>
							</Col>
						</Row>
					</Form.Item>
					<Form.Item name="6">
						<Row align="middle" gutter={[10, 10]}>
							<Col span={24}>
								<Radio value={4}>指定商品拆单</Radio>
								<Typography as="s1" color="rgba(153, 153, 153, 1)">
									（所有的指定商品拆分到同一个订单里）
								</Typography>
							</Col>
							<Col span={24}>
								<div className={Style.item_padding}>
									<CommonInput placeholder="必填，请输入指定款式编码，多个款式编码逗号隔开" aria-required />
								</div>
							</Col>
							<Col span={24}>
								<div className={Style.item_padding}>
									<CommonInput placeholder="必填，请输入指定商品编码，多个商品编码逗号隔开" aria-required />
								</div>
							</Col>
							<Col span={24}>
								<Typography className={Style.item_padding} as="s1" color="rgba(153, 153, 153, 1)">
									以上2个字段是“或”的关系，至少填写一项
								</Typography>
							</Col>
							<Col span={12}>
								<Typography className={Style.item_padding} as="s1">
									拆分出来的所有订单，每单的最大数量为
								</Typography>
							</Col>
							<Col span={12}>
								<CommonInput placeholder="请输入数量" />
							</Col>
							<Col span={12}></Col>
							<Col span={12}>
								<Typography as="s1" color="rgba(153, 153, 153, 1)">
									超过这个数量的订单，将会再次进行拆分
								</Typography>
							</Col>
							<Col span={24}>
								<div className={Style.item_padding}>
									<CommonInput placeholder="请输入不参加单独拆分的款式编码，多个款式编码逗号隔开" />
								</div>
							</Col>
							<Col span={24}>
								<div className={Style.item_padding}>
									<CommonInput placeholder="请输入不参加单独拆分的商品编码，多个商品编码逗号隔开" />
								</div>
							</Col>
							<Col span={24}>
								<Typography className={Style.item_padding} as="s1" color="rgba(153, 153, 153, 1)">
									以上2个字段是“或”的关系，至少填写一项
								</Typography>
							</Col>
						</Row>
					</Form.Item>
					<Form.Item name="6">
						<Row align="middle" gutter={[10, 10]}>
							<Col span={24}>
								<Radio value={4}>按重量拆分</Radio>
								<Typography as="s1" color="rgba(153, 153, 153, 1)">
									（按照设置的重量拆分）
								</Typography>
							</Col>
							<Col span={24}>
								<div className={Style.item_padding}>
									<CommonInput placeholder="必填，请输入拆分最大重量" suffix="kg" aria-required />
								</div>
							</Col>
							<Col span={24}>
								<div className={Style.item_padding}>
									<CommonInput placeholder="请输入拆分最小重量" suffix="kg" />
								</div>
							</Col>
							<Col span={24}>
								<Typography className={Style.item_padding} as="s1" color="rgba(153, 153, 153, 1)">
									<span style={{ marginRight: "5px", color: "rgba(240, 61, 41, 1)" }}>*</span>
									拆单重量必须大于最小重量
								</Typography>
							</Col>
						</Row>
					</Form.Item>
				</Radio.Group>
				<SubTitle className={Style.title} title="参与订单" as="s2" symbol />
				<Radio.Group className={Style.radio_group}>
					<Form.Item name="7">
						<Row align="middle">
							<Col span={24}>
								<Radio value={5}>订单列表勾选的订单</Radio>
								<Typography as="s1" color="rgba(153, 153, 153, 1)">
									（只限待审核）
								</Typography>
							</Col>
						</Row>
					</Form.Item>
					<Form.Item name="8">
						<Row align="middle" gutter={[10, 10]}>
							<Col span={24}>
								<Radio value={6}>所有符合条件的订单</Radio>
								<Typography as="s1" color="rgba(153, 153, 153, 1)">
									（根据筛选出来的订单，只限待审核）
								</Typography>
							</Col>
							<Col span={24}>
								<div className={Style.item_padding}>
									<CommonInput placeholder="有拆分历史的订单允许继续拆单" />
								</div>
							</Col>
							<Col span={24}>
								<div className={Style.item_padding}>
									<CommonInput placeholder="有合单历史的订单允许继续拆单" />
								</div>
							</Col>
						</Row>
					</Form.Item>
				</Radio.Group>
			</Form>
		</CommonModal>
	);
}

export default AddSplittingStrategy;
